
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit" />
    <link rel="shortcut icon" href="favicon.ico">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content="Cheney" />
    
    <title>MxsDoc</title>
    <link href="css/logo/logo.css" rel="stylesheet">
    <!-- Bootstrap -->
    <link href="static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="static/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="static/highlight/styles/default.css" rel="stylesheet">
    <link href="static/highlight/styles/zenburn.css" rel="stylesheet">
    <link href="static/zTree/css/metroStyle/metroStyle.css" rel="stylesheet">
    <link href="static/nprogress/nprogress.css" rel="stylesheet">
    <link href="static/styles/kancloud.css" rel="stylesheet">
    <link href="static/bootstrapQ/qiao.css" rel="stylesheet">
    <link href="static/markdown/css/editormd.min.css" rel="stylesheet">
    <link href="static/zTree/css/metroStyle/standardStyle.css" rel="stylesheet" id="zTreeCss">
    

	<!-- FreeTeam CSS-->
	<link rel="stylesheet" href="static/freeTeam/css/resetV2.css" type="text/css" media="screen" />
	<link rel="stylesheet" href="static/freeTeam/css/boot-css/bootstrap.custom.css" type="text/css" media="screen" /> 

	<!-- context.js -->
	<link rel="stylesheet" type="text/css" href="static/ContextJS/css/demo.css">
	<link rel="stylesheet" type="text/css" href="static/ContextJS/css/context.standalone.css">
    <script src="static/scripts/jquery.min.js" type="text/javascript"></script>
    <!-- Include all compiled plugins (below), or include individual file	s as needed -->
	<script type="text/javascript" src="static/bootstrap/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="static/layer/layer.js"></script>
	<script type="text/javascript" src="static/nprogress/nprogress.js"></script>
	<script type="text/javascript" src="static/highlight/highlight.js"></script>
	<script type="text/javascript" src="static/highlight/highlightjs-line-numbers.min.js"></script>
	<script type="text/javascript" src="static/bootstrapQ/qiao.js"></script>
	<script type="application/javascript" src="static/markdown/lib/raphael.min.js"></script>
	<script type="application/javascript" src="static/scripts/jsonEscape.js"></script>
	<!-- For ajax form submit -->
	<script  type="text/javascript" src="static/scripts/jquery.form.js"></script>
    <script src="js/common.js" type="text/javascript"></script>
    <script src="js/DocSys.js" type="text/javascript"></script>
    <script type="text/javascript" src="js/base64.js"></script>
</head>
<body>
<div class="m-manual manual-reader">
    <header class="navbar navbar-static-top manual-head" role="banner">
        <div class="container-fluid">
            <div class="navbar-header pull-left manual-title">
            	<a class="navbar-brand" href="/DocSystem/web/projects.html">
            		<i class="logo small"></i> 
            		MxsDoc
            	</a>
                <span class="slidebar" id="slidebar">
                    <i class="fa fa-align-justify"></i>
                </span>
            </div>

            <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
                <ul class="nav navbar-nav navbar-left">
                	<div>多线程下载测试</div>
            	</ul>
            </nav>
        </div>      
    </header>
    <article class="container-fluid manual-body">
        <div class="manual-right" style="left:0px;overflow-y: auto;">
            <div class="manual-article">
               <div class="article-body editor-content"  id="doc" style="min-height: 650px">
               		<div class="panel-body eventset-list" >	
	               		<li class="eventset-tit" style="margin-top: 0px;">
							<i class="cell w7">名称</i>
							<i class="cell w20">地址</i>
							<i class="cell w15">参数</i>
							<i class="cell w10">结果</i>
							<i class="cell w10">操作</i>						
						</li>
					</div>
               		<div class="panel-body eventset-list">

			 			<li>	
			 				<i class="cell w7">文件下载</i> 	
			 				<i class="cell w20">		
			 					<input id="downloadFileUrl" value="" type="text" style="width:80%">
			 				</i>	
			 				<i class="cell w15">		
			 					<textarea id="downloadFileParam">
			 					{
			 					}		 					
			 					</textarea>
			 				</i>	
			 				<i class="cell w10">		
			 					<div id="downloadFileResult"></div>
			 				</i>
			 				<i class="cell w10">
			 					<a href="javascript:void(0)" onclick="downloadFileTest();" class="mybtn-primary">下载</a>
			 				</i>
			 			</li>
					</div>
        <div class="manual-progress"><b class="progress-bar"></b></div>
    </article>
    <div class="manual-mask"></div>
</div>

<script type="text/javascript">

//页面加载完成处理函数
$(document).ready(function(){
	console.log("Page is ready");
});

function downloadFileTest()
{		
	var paramStr = $("#downloadFileParam").val();
	console.log(paramStr);	
	var param = JSON.parse(paramStr);
	console.log(param);
	
	//发送predict
	var url = $("#downloadFileUrl").val();
    // 文件URL
    //const fileUrl = 'https://example.com/largefile.zip';
    
    downloadFile(url);
}

async function downloadFile(fileUrl) {
    // 文件URL
    //const fileUrl = 'https://example.com/largefile.zip';
    // 每块大小（单位：字节），1MB
    const chunkSize = 1 * 1024 * 1024;

    // 获取文件大小
    const response = await fetch(fileUrl, { method: 'HEAD' });
    const fileSize = parseInt(response.headers.get('Content-Length'), 10);
    console.log(`File Size: ${fileSize} bytes`);

    const numberOfChunks = Math.ceil(fileSize / chunkSize);
    console.log(`Number of Chunks: ${numberOfChunks}`);

    let fileContent = new Uint8Array(fileSize);
    let offset = 0;

    for (let i = 0; i < numberOfChunks; i++) {
        const start = i * chunkSize;
        const end = Math.min(start + chunkSize, fileSize) - 1;

        console.log(`Downloading chunk ${i + 1} from ${start} to ${end}`);

        const chunkResponse = await fetch(fileUrl, {
            headers: {
                'Range': `bytes=${start}-${end}`
            }
        });

        if (chunkResponse.ok) {
            const chunkArrayBuffer = await chunkResponse.arrayBuffer();
            console.error('chunkArrayBuffer.byteLength', chunkArrayBuffer.byteLength );
            fileContent.set(new Uint8Array(chunkArrayBuffer), offset);
            offset += chunkArrayBuffer.byteLength;
        } else {
            console.error('Error downloading chunk', i);
            return;
        }
    }

    // 拼接完成的文件，你可能需要将其保存到磁盘或者处理
    console.log('Download complete!');

    // 示例：在浏览器中下载文件
    const blob = new Blob([fileContent]);
    const downloadUrl = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = downloadUrl;
    a.download = 'downloaded-file.zip'; // 你可以调整文件名
    a.click();
    URL.revokeObjectURL(downloadUrl);
}

</script>
</body>
</html>